<template>
    <div id="sy">
        <div class="warpe">
            <div class="banner">
                <div class="swipe">
                    <ul id="slider">
                        <li>
                            <a href="#"><img src="../../assets/img/banner.jpg" alt="" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="../../assets/img/banner.jpg" alt="" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="../../assets/img/banner.jpg" alt="" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="../../assets/img/banner.jpg" alt="" /></a>
                        </li>
                        <li>
                            <a href="#"><img src="../../assets/img/banner.jpg" alt="" /></a>
                        </li>
                    </ul>
                    <div id="pagenavi">
                        <a href="javascript:void(0);" class="active"></a>
                        <a href="javascript:void(0);" class=""></a>
                        <a href="javascript:void(0);" class=""></a>
                        <a href="javascript:void(0);" class=""></a>
                        <a href="javascript:void(0);" class=""></a>
                    </div>
                </div>
                <div class="title_name">保利罗兰</div>
                <div class="mess_iocn animated rotateIn">
                    <a href="message.html">
                        <i class="icon-credit-card puff_left"></i>
                        <span></span>
                    </a>
                </div>
            </div>
            <div class="nav margin_top">
                <div class="pictitle pictitle2">
                    <span class="picbg"></span>
                    <span>物业服务</span>
                </div>
                <ul>
                    <li>
                        <a href="Property.html">
                            <p><img src="../../assets/img/icon_wy.png" class="animated bounceIn"></p>
                            <span>物业缴费</span>
                        </a>
                    </li>
                    <li>
                        <a href="Property_bill.html">
                            <p><img src="../../assets/img/icon_zd.png" class="animated rotateIn"></p>
                            <span>账单查询</span>
                        </a>
                    </li>
                    <li>
                        <a href="Repair.html">
                            <p><img src="../../assets/img/icon_ts.png" class="animated bounceIn"></p>
                            <span>投诉保修</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <p><img src="../../assets/img/icon_zs.png" class="animated rotateIn"></p>
                            <span>租售中心</span>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="sc_div">
                <div class="pictitle pictitle2">
                    <span class="picbg"></span>
                    <span>健康服务</span>
                </div>
                <ul class="sc_list">
                    <li>
                        <a href="#">
                            <p><img src="../../assets/img/icon_yy.png" class="animated bounceIn"></p>
                            <span>预约挂号</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <p><img src="../../assets/img/icon_jz2.png" class="animated rotateIn"></p>
                            <span>就诊服务</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <p><img src="../../assets/img/icon_sy.png" class="animated bounceIn"></p>
                            <span>送药上门</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <p><img src="../../assets/img/icon_jkjz.png" class="animated rotateIn"></p>
                            <span>健康讲座</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <p><img src="../../assets/img/icon_jkda.png" class="animated bounceIn"></p>
                            <span>健康档案</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <p><img src="../../assets/img/icon_zd.png" class="animated rotateIn"></p>
                            <span>健康咨询</span>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="Area">
                <div class="pictitle pictitle2">
                    <span class="picbg"></span>
                    <span>商圈服务</span>
                </div>
                <ul>
                    <li>
                        <a href="#">
                            <img src="../../assets/img/icon_xhyd.png" class="animated bounceIn">
                            <span>鲜花预定</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../../assets/img/icon_cyfw.png" class="animated rotateIn">
                            <span>餐饮服务</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../../assets/img/icon_mrmj.png" class="animated bounceIn">
                            <span>美容美甲</span>
                        </a>
                    </li>
                    <!--<li>
                        <a href="#">
                            <img src="../../assets/img/icon_sq01.png" class="animated bounceIn">
                            <span>鲜花预定</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../../assets/img/icon_sq02.png" class="animated rotateIn">
                            <span>餐饮服务</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../../assets/img/icon_sq03.png" class="animated bounceIn">
                            <span>美容美甲</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../../assets/img/icon_sq04.png" class="animated bounceIn">
                            <span>鲜花预定</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../../assets/img/icon_sq05.png" class="animated rotateIn">
                            <span>餐饮服务</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../../assets/img/icon_sq06.png" class="animated bounceIn">
                            <span>美容美甲</span>
                        </a>
                    </li>-->
                </ul>
            </div>
            <div class="center">
                <div class="pictitle">
                    <span class="picbg"></span>
                    <span>特卖服务</span>
                    <a href="#" class="puff_right">更多 ></a>
                </div>
                <div class="bannerside">
                    <a href="#"><img src="../../assets/img/pic1.jpg"></a>
                </div>
                <div class="bannerside">
                    <a href="#"><img src="../../assets/img/pic2.jpg"></a>
                </div>
                <div class="bannerside">
                    <a href="#"><img src="../../assets/img/pic3.jpg"></a>
                </div>
                <div class="id_bth">
                    <a href="#">进入社区大家庭</a>
                </div>
            </div>
        </div>
        <div class="navside">
            <ul>
                <li class="margin_left animated bounceInLeft">
                    <router-link :to="homeLink">
                        <p><i class="icon-home"></i> </p>
                        <span>首页</span>
                    </router-link>
                </li>
                <li class="animated bounceInRight">
                    <router-link :to="znzxLink">
                        <p><i class="icon-globe"></i> </p>
                        <span>智能中心</span>
                    </router-link>
                </li>
                <li class="animated bounceInLeft">
                    <router-link :to="fwzxLink" class="navside_hover">
                        <p><i class="icon-star-empty"></i> </p>
                        <span>服务中心</span>
                    </router-link>
                </li>
                <li class="animated bounceInRight">
                    <router-link :to="sqhdLink">
                        <p><i class="icon-columns"></i> </p>
                        <span>社区互动</span>
                    </router-link>
                </li>
                <li class="animated bounceInLeft">
                    <router-link :to="xxzxLink">
                        <p><i class="  icon-th-large"></i> </p>
                        <span>信息中心</span>
                    </router-link>
                </li>
            </ul>
        </div>
    </div>
</template>

<script>
    export default {
        props: {

        },
        data(){
            return {
                homeLink: '/home',
                znzxLink: '/znzx',
                fwzxLink: '/fwzx',
                sqhdLink: '/sqhd',
                xxzxLink: '/xxzx',
            }
        },
        methods: {
            changeTitle: function () {
            }
        }
    }
</script>


<style scoped>
    h1 {
        color: #222;
        text-align: center;
    }
</style>
